import React,{ Component } from 'react';
import Dheader from './component/Detail/Dheader.js'
import DgoBack from './component/Detail/DgoBack.js'
import Dlist from './component/Detail/Dlist.js'
import axios from 'axios';

class Detail extends Component {
      
    constructor(props){
        super(props);
        this.state={
            Dheader:{},
            categoryList:[]
        }
    }
    _getDateilData = ()=>{
        axios.get('https://www.easy-mock.com/mock/5b42fe459fb42c572b20c6cb/travle/detail')
        .then( (response) => {
             this.setState({
                Dheader:response.data.data,
                categoryList:response.data.data.categoryList
             })
        })
        .catch( (error) => {
          console.log(error);
        });
    }
    componentDidMount =  ()=>{
      this._getDateilData();
    }
    render() {

       return (
           <div className="detail" >
               <Dheader Dheader={this.state.Dheader}/>
               <DgoBack/>
               {
                   this.state.categoryList.map((item,i)=>{
                       return <Dlist key={i} item={item}/>
                   })
               }
               
           </div>
       )
    }
}
export default Detail;